import React, { Component } from 'react'

export default class Test extends Component {
  constructor() {
    super()
    console.log(1, 'constructor')
  }
  render() {
    console.log(2, 'render')
    return (
      <div>
        Test,
        <button
          onClick={() => {
            this.setState({
              // 注意: 如果没有状态yyy,则会自动帮我们给组件实例添加状态yyy
              yyy: 123,
            })
          }}
        >
          调用Test自己的setState
        </button>
        <button
          onClick={() => {
            this.forceUpdate()
          }}
        >
          强制更新
        </button>
      </div>
    )
  }
  componentDidMount() {
    console.log(3, 'componentDidMount', '此时页面已经渲染完毕了')
  }
  componentDidUpdate() {
    console.log('更新完毕', 'componentDidUpdate', '此时页面已经更新完毕了')
  }

  componentWillUnmount() {
    console.log('组件即将卸载', 'componentWillUnmount')
  }
}
